<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>Product管理</title>
  <link rel="stylesheet" href="/myplugs/css/portal.css">
</head>
<body>
<div class="app-content pt-3 p-md-3 p-lg-4">
  <div class="container-xl">
    <div class="row g-3 mb-4 align-items-center justify-content-between">
      <div class="col-auto">
        <h1 class="app-page-title mb-0">Product管理</h1>
      </div>

      <div class="col-auto">
        <div class="page-utilities">
          <div class="row g-2 justify-content-start justify-content-md-end align-items-center">
            <div class="col-auto">
              <form class="table-search-form row gx-1 align-items-center">
                <div class="col-auto">
                  <input type="text" id="search-orders" name="searchorders" class="form-control search-orders" placeholder="请输入待搜索内容">
                </div>
                <div class="col-auto">
                  <button type="submit" class="btn app-btn-secondary">搜索</button>
                </div>
              </form>
            </div><!--//col-->
          </div><!--//row-->
        </div><!--//table-utilities-->
      </div><!--//col-auto-->
    </div><!--//row-->


    <div class="tab-content" id="orders-table-tab-content">
      <div class="tab-pane fade show active" id="orders-all" role="tabpanel" aria-labelledby="orders-all-tab">
        <div class="app-card app-card-orders-table shadow-sm mb-5">
          <div class="app-card-body">
            <div class="table-responsive">
              <table class="table app-table-hover mb-0 text-left" cellspacing="0">

                <thead>
                <!--tr不需要表头>
                  <th class="cell">用户名</th>
                  <th class="cell">邮箱</th>
                  <th class="cell">姓名</th>
                  <th class="cell">第一地址</th>
                  <th class="cell">第二地址</th>
                  <th class="cell">电话号码</th>
                  <th class="cell"></th>
                  <th class="cell"></th>
                </tr-->
                </thead>

                <tbody>
                <!--第一行-->
                <tr th:each="Product:${Product}">

                  <!--第一行-->
                  <!--
                  <td class="cell" th:text="${Account.userid}" id="AccountUserId"></td>
                  <td class="cell" th:text="${Account.email!=null}?${Account.email}:'邮箱未知'"></td>
                  <td class="cell" th:text="${Account.firstName+Account.lastName!=null}?${Account.firstName+' '+Account.lastName}:'小明'"></td>
                  <td class="cell"><span class="badge bg-success" th:text="${Account.address1!=null}?${Account.address1}:'地址未知'"></span></td>
                  <td class="cell"><span class="badge bg-warning" th:text="${Account.address2!=null}?${Account.address2}:'地址未知'"></span></td>
                  <td class="cell" th:text="${Account.phone}"></td>
                  <td class="cell"><a class="btn-sm app-btn-primary" th:href="@{/user/reset_user_password(userid=${Account.userid})}">重置密码</a></td>
                  <td class="cell"><a class="btn-sm app-btn-secondary" onclick="showPopup()" th:class="inf">编辑信息</a></td-->

                  <!--第一行的第一列-->
                  <!--td class="cell" th:text="${Product.productid}" id="ProuductId"-->
                  <td class="cell"  id="ProuductId">

                    <div class="col-12 col-lg-6" >
                      <div class="app-card app-card-account shadow-sm d-flex flex-column align-items-start">
                        <div class="app-card-header p-3 border-bottom-0">
                          <div class="row align-items-center gx-3">
                            <div class="col-auto">
                              <div class="app-icon-holder">
                                <svg t="1679584332228" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3435" width="200" height="200"><path d="M124.641235 557.046968c-11.967365 0-23.483131-6.548181-29.353914-17.16075-6.999779-12.418964-5.644983-27.773319 3.612789-38.611687 0 0 287.442558-340.505402 359.020948-425.631753 5.193385-6.322381 12.644763-10.38677 20.54774-11.741565 122.157442-18.967144 387.020066 138.866593 433.083131 328.086439 2.257993 9.257773 0.451599 18.741345-4.741786 26.644322-5.193385 7.902977-13.54796 13.096362-22.805733 14.676957L130.286218 556.595369c-1.806395 0.225799-3.612789 0.451599-5.644983 0.451599zM500.822933 130.060419c-58.933627 69.997795-207.509592 246.121279-291.055348 344.79559l624.335171-101.835502C776.298126 239.347299 588.207277 130.060419 501.951929 130.060419h-1.128996z" fill="#919191" p-id="3436"></path><path d="M124.641235 1015.645424c-7.902977 0-15.580154-2.709592-21.902536-7.902976-7.677178-6.548181-11.967365-16.031753-11.967365-25.966924V523.177067c0-18.741345 15.128556-33.869901 33.869901-33.869901s33.869901 15.128556 33.869901 33.869901V941.583241l680.107607-118.318853 6.096582-423.37376a33.869901 33.869901 0 0 1 33.869901-33.418302h0.451599c18.741345 0.225799 33.644101 15.580154 33.418302 34.3215l-6.548181 451.598677c-0.225799 16.257552-11.967365 30.031312-27.999118 32.966703l-747.39581 129.83462c-1.806395 0.225799-3.838589 0.451599-5.870783 0.451598z" fill="#919191" p-id="3437"></path><path d="M514.145094 196.897023m-112.89967 0a112.899669 112.899669 0 1 0 225.799339 0 112.899669 112.899669 0 1 0-225.799339 0Z" fill="#FFFFFF" p-id="3438"></path><path d="M514.145094 343.440794c-80.836163 0-146.76957-65.707607-146.76957-146.76957s65.933407-146.76957 146.76957-146.76957 146.76957 65.707607 146.76957 146.76957-65.707607 146.76957-146.76957 146.76957z m0-225.573539c-43.579272 0-79.029768 35.450496-79.029769 79.029768s35.450496 79.029768 79.029769 79.029769 79.029768-35.450496 79.029768-79.029769-35.450496-79.029768-79.029768-79.029768zM124.641235 782.394708c-16.257552 0-30.482911-11.741566-33.418302-28.224917-3.161191-18.515546 9.257773-35.902095 27.773318-39.063286l750.782801-127.576626c18.515546-2.935391 35.902095 9.257773 39.063285 27.773318s-9.257773 35.902095-27.773318 39.063286L130.512018 781.943109c-2.032194 0.225799-3.838589 0.451599-5.870783 0.451599z" fill="#919191" p-id="3439"></path></svg>
                              </div><!--//icon-holder-->
                            </div><!--//col-->
                            <div class="col-auto">
                              <h4 class="app-card-title">信息展示</h4>
                            </div><!--//col-->
                          </div><!--//row-->
                        </div><!--//app-card-header-->
                        <div class="app-card-body px-4 w-100">
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label mb-2" ><strong>图片</strong></div>
                                <div class="item-data"><img class="profile-image" src="/images/test.jpg" alt=""></div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改图片</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label"><strong>ItemId</strong></div>
                                <div class="item-data">EST-1</div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改Id</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label"><strong>甜品名</strong></div>
                                <div class="item-data">甜甜圈</div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改名称</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label"><strong>售价</strong></div>
                                <div class="item-data">￥15.30</div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改售价</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label"><strong>进货价</strong></div>
                                <div class="item-data">
                                  ￥9.30
                                </div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改进货价</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label"><strong>计量单位</strong></div>
                                <div class="item-data">
                                  1.0磅
                                </div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改计量单位</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label"><strong>库存</strong></div>
                                <div class="item-data">
                                  1000磅
                                </div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改库存量</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                        </div><!--//app-card-body-->
                        <div class="app-card-footer p-4 mt-auto">
                          <a class="btn app-btn-secondary" id="CorrectMoreInformation" href="#">修改更多信息</a>
                        </div><!--//app-card-footer-->
                      </div><!--//app-card-->
                    </div><!--//col-->
                    <!--第一行第一列结束-->
                  </td>

                  <!--第一行的第二列-->
                  <!--td class="cell" th:text="${Account.userid}" id="AccountUserId"-->
                  <td class="cell"  id="AccountUserId">

                    <div class="col-12 col-lg-6">
                      <div class="app-card app-card-account shadow-sm d-flex flex-column align-items-start">
                        <div class="app-card-header p-3 border-bottom-0">
                          <div class="row align-items-center gx-3">
                            <div class="col-auto">
                              <div class="app-icon-holder">
                                <svg t="1679584332228" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3435" width="200" height="200"><path d="M124.641235 557.046968c-11.967365 0-23.483131-6.548181-29.353914-17.16075-6.999779-12.418964-5.644983-27.773319 3.612789-38.611687 0 0 287.442558-340.505402 359.020948-425.631753 5.193385-6.322381 12.644763-10.38677 20.54774-11.741565 122.157442-18.967144 387.020066 138.866593 433.083131 328.086439 2.257993 9.257773 0.451599 18.741345-4.741786 26.644322-5.193385 7.902977-13.54796 13.096362-22.805733 14.676957L130.286218 556.595369c-1.806395 0.225799-3.612789 0.451599-5.644983 0.451599zM500.822933 130.060419c-58.933627 69.997795-207.509592 246.121279-291.055348 344.79559l624.335171-101.835502C776.298126 239.347299 588.207277 130.060419 501.951929 130.060419h-1.128996z" fill="#919191" p-id="3436"></path><path d="M124.641235 1015.645424c-7.902977 0-15.580154-2.709592-21.902536-7.902976-7.677178-6.548181-11.967365-16.031753-11.967365-25.966924V523.177067c0-18.741345 15.128556-33.869901 33.869901-33.869901s33.869901 15.128556 33.869901 33.869901V941.583241l680.107607-118.318853 6.096582-423.37376a33.869901 33.869901 0 0 1 33.869901-33.418302h0.451599c18.741345 0.225799 33.644101 15.580154 33.418302 34.3215l-6.548181 451.598677c-0.225799 16.257552-11.967365 30.031312-27.999118 32.966703l-747.39581 129.83462c-1.806395 0.225799-3.838589 0.451599-5.870783 0.451598z" fill="#919191" p-id="3437"></path><path d="M514.145094 196.897023m-112.89967 0a112.899669 112.899669 0 1 0 225.799339 0 112.899669 112.899669 0 1 0-225.799339 0Z" fill="#FFFFFF" p-id="3438"></path><path d="M514.145094 343.440794c-80.836163 0-146.76957-65.707607-146.76957-146.76957s65.933407-146.76957 146.76957-146.76957 146.76957 65.707607 146.76957 146.76957-65.707607 146.76957-146.76957 146.76957z m0-225.573539c-43.579272 0-79.029768 35.450496-79.029769 79.029768s35.450496 79.029768 79.029769 79.029769 79.029768-35.450496 79.029768-79.029769-35.450496-79.029768-79.029768-79.029768zM124.641235 782.394708c-16.257552 0-30.482911-11.741566-33.418302-28.224917-3.161191-18.515546 9.257773-35.902095 27.773318-39.063286l750.782801-127.576626c18.515546-2.935391 35.902095 9.257773 39.063285 27.773318s-9.257773 35.902095-27.773318 39.063286L130.512018 781.943109c-2.032194 0.225799-3.838589 0.451599-5.870783 0.451599z" fill="#919191" p-id="3439"></path></svg>
                              </div><!--//icon-holder-->
                            </div><!--//col-->
                            <div class="col-auto">
                              <h4 class="app-card-title">信息展示</h4>
                            </div><!--//col-->
                          </div><!--//row-->
                        </div><!--//app-card-header-->
                        <div class="app-card-body px-4 w-100">
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label mb-2"><strong>图片</strong></div>
                                <div class="item-data"><img class="profile-image" src="/images/test.jpg" alt=""></div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改图片</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label"><strong>ItemId</strong></div>
                                <div class="item-data">EST-1</div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改Id</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label"><strong>甜品名</strong></div>
                                <div class="item-data">甜甜圈</div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改名称</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label"><strong>售价</strong></div>
                                <div class="item-data">￥15.30</div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改售价</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label"><strong>进货价</strong></div>
                                <div class="item-data">
                                  ￥9.30
                                </div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改进货价</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label"><strong>计量单位</strong></div>
                                <div class="item-data">
                                  1.0磅
                                </div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改计量单位</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                          <div class="item border-bottom py-3">
                            <div class="row justify-content-between align-items-center">
                              <div class="col-auto">
                                <div class="item-label"><strong>库存</strong></div>
                                <div class="item-data">
                                  1000磅
                                </div>
                              </div><!--//col-->
                              <div class="col text-end">
                                <a class="btn-sm app-btn-secondary" href="#">修改库存量</a>
                              </div><!--//col-->
                            </div><!--//row-->
                          </div><!--//item-->
                        </div><!--//app-card-body-->
                        <div class="app-card-footer p-4 mt-auto">
                          <a class="btn app-btn-secondary" id="CorrectMoreInformation" href="#">修改更多信息</a>
                        </div><!--//app-card-footer-->
                      </div><!--//app-card-->
                    </div><!--//col-->
                  </td>
                  <!--第一行第二列结束-->

                </tr><!--第一行结束-->


                 </tbody>
              </table>

            </div><!--//table-responsive-->
          </div><!--//app-card-body-->
        </div><!--//app-card-->
        <!--                    <nav class="app-pagination">-->
        <!--                        <ul class="pagination justify-content-center">-->
        <!--                            <li class="page-item disabled">-->
        <!--                                <a class="page-link" href="#" tabindex="-1" aria-disabled="true">上一页</a>-->
        <!--                            </li>-->
        <!--                            <li class="page-item active"><a class="page-link" href="#">1</a></li>-->
        <!--                            <li class="page-item"><a class="page-link" href="#">2</a></li>-->
        <!--                            <li class="page-item"><a class="page-link" href="#">3</a></li>-->
        <!--                            <li class="page-item">-->
        <!--                                <a class="page-link" href="#">下一页</a>-->
        <!--                            </li>-->
        <!--                        </ul>-->
        <!--                    </nav>&lt;!&ndash;//app-pagination&ndash;&gt;-->
      </div><!--//tab-pane-->
    </div><!--//tab-content-->
  </div><!--//container-fluid-->
</div><!--//app-content-->


  </div><!--//container-fluid-->
</div><!--//app-content-->

<!-- 弹窗修改更多信息-->
<div class="overlay" id="overlay" style="display: none;"></div>
<form method="post" action="update_user_information" >
  <div class="popup row gy-4" id="popup" style="display: none;">
    <div class="col-12 col-lg-update">
      <div class="app-card app-card-account shadow-sm d-flex flex-column align-items-start">
        <div class="app-card-body px-4 w-100">
          <div class="item border-bottom py-3">
            <div class="row justify-content-between align-items-center">
              <div class="col-auto">
                <div class="item-label"><strong>用户名</strong></div>
                <input class="item-data" id="userid" name="userid" readonly="readonly"/>
              </div><!--//col-->
            </div><!--//row-->
          </div><!--//item-->
          <div class="item border-bottom py-3">
            <div class="row justify-content-between align-items-center">
              <div class="col-auto">
                <div class="item-label"><strong>邮箱</strong></div>
                <input class="item-data" id="email" name="email"/>
              </div><!--//col-->
            </div><!--//row-->
          </div><!--//item-->
          <div class="item border-bottom py-3">
            <div class="row justify-content-between align-items-center">
              <div class="col-auto">
                <div class="item-label"><strong>姓氏</strong></div>
                <input class="item-data" id="firstname" name="firstname"/>
              </div><!--//col-->
            </div><!--//row-->
          </div><!--//item-->
          <div class="item border-bottom py-3">
            <div class="row justify-content-between align-items-center">
              <div class="col-auto">
                <div class="item-label"><strong>名字</strong></div>
                <input class="item-data" id="lastname" name="lastname"/>
              </div><!--//col-->
            </div><!--//row-->
          </div><!--//item-->
          <div class="item border-bottom py-3">
            <div class="row justify-content-between align-items-center">
              <div class="col-auto">
                <div class="item-label"><strong>状态</strong></div>
                <input class="item-data" id="status" name="status"/>
              </div><!--//col-->
            </div><!--//row-->
          </div><!--//item-->
          <div class="item border-bottom py-3">
            <div class="row justify-content-between align-items-center">
              <div class="col-auto">
                <div class="item-label"><strong>第一地址</strong></div>
                <input class="item-data" id="addr1" name="addr1"/>
              </div><!--//col-->
            </div><!--//row-->
          </div><!--//item-->
          <div class="item border-bottom py-3">
            <div class="row justify-content-between align-items-center">
              <div class="col-auto">
                <div class="item-label"><strong>第二地址</strong></div>
                <input class="item-data" id="addr2" name="addr2"/>
              </div><!--//col-->
            </div><!--//row-->
          </div><!--//item-->
          <div class="item border-bottom py-3">
            <div class="row justify-content-between align-items-center">
              <div class="col-auto">
                <div class="item-label"><strong>城市</strong></div>
                <input class="item-data" id="city" name="city"/>
              </div><!--//col-->
            </div><!--//row-->
          </div><!--//item-->
          <div class="item border-bottom py-3">
            <div class="row justify-content-between align-items-center">
              <div class="col-auto">
                <div class="item-label"><strong>省</strong></div>
                <input class="item-data" id="state" name="state"/>
              </div><!--//col-->
            </div><!--//row-->
          </div><!--//item-->
          <div class="item border-bottom py-3">
            <div class="row justify-content-between align-items-center">
              <div class="col-auto">
                <div class="item-label"><strong>邮政编码</strong></div>
                <input class="item-data" id="zip" name="zip"/>
              </div><!--//col-->
            </div><!--//row-->
          </div><!--//item-->
          <div class="item border-bottom py-3">
            <div class="row justify-content-between align-items-center">
              <div class="col-auto">
                <div class="item-label"><strong>国家</strong></div>
                <input class="item-data" id="country" name="country"/>
              </div><!--//col-->
            </div><!--//row-->
          </div><!--//item-->
          <div class="item border-bottom py-3">
            <div class="row justify-content-between align-items-center">
              <div class="col-auto">
                <div class="item-label"><strong>电话号码</strong></div>
                <input class="item-data" id="phone" name="phone"/>
              </div><!--//col-->
            </div><!--//row-->
          </div><!--//item-->
        </div><!--//app-card-body-->
      </div>
    </div>
    <div class="app-card-footer p-4 mt-auto">
      <button type="submit" class="btn app-btn-secondary" onclick="hidePopup()">保存所有信息</button>
      <button class="btn app-btn-secondary" onclick="hidePopup()">取消</button>
    </div><!--//app-card-footer-->
  </div>
</form>
<script src="/myplugs/js/floating_window.js"> </script>
<!--弹窗修改信息完毕-->
</body>
</html>